<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div{
    width : 400px;
    height : 400px;
    background-color : pink;
    
}
p {
    width : 100px;
    height : 100px;
    margin-bottom: 10px;
    background-color : gray;
    
}
</style>
</head>
<body>
<div>
    <p id="p1"></p>
    <p id="p2"></p>
</div>
<script>
var div = document.querySelector("div");
document.onclick = function (e){
    switch(e.target.id){
        case "p1":
            
            console.log("你点击了p1");
            break;
        case  "p2":
            
            console.log("你点击了p2");
            break;
    }
}
</script>
</body>
</html>